<template>
  <div class="mod-swfTask__swftask">
    <el-table v-loading="state.dataListLoading" :data="state.dataList" border @selection-change="state.dataListSelectionChangeHandle" style="width: 100%">
      <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
      <el-table-column prop="phaseName" label="审批段名称" header-align="center" align="center"></el-table-column>
      <el-table-column prop="applTypeName" label="申请单类型" header-align="center" align="center"></el-table-column>
      <el-table-column prop="aprvUser" label="审批人" header-align="center" align="center"></el-table-column>
      <el-table-column prop="isLastAprv" label="是否终审" header-align="center" align="center">
        <template #default="scope">
          <span>{{ scope.row.isLastAprv === 0 ? "否" : "是" }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="aprvResult" label="审批结果" header-align="center" align="center">
        <template #default="scope">
          <span v-if="scope.row.aprvResult === 1">同意</span>
          <span v-else-if="scope.row.aprvResult === 2">拒绝</span>
          <span v-else-if="scope.row.aprvResult === 3">退回</span>
        </template>
      </el-table-column>
      <el-table-column prop="aprvDate" label="审批时间" header-align="center" align="center">
        <template #default="scope">
          {{ scope.row.aprvDate ? dayjs(scope.row.aprvDate).format("YYYY-MM-DD HH:mm:ss") : "" }}
        </template>
      </el-table-column>
      <el-table-column prop="aprvComment" label="审批意见" header-align="center" align="center"></el-table-column>
      <el-table-column prop="createDate" label="创建时间" header-align="center" align="center">
        <template #default="scope">
          {{ scope.row.createDate ? dayjs(scope.row.createDate).format("YYYY-MM-DD HH:mm:ss") : "" }}
        </template>
      </el-table-column>
      <el-table-column prop="remark" label="备注" header-align="center" align="center"></el-table-column>
    </el-table>
    <el-pagination :current-page="state.page" :page-sizes="[10, 20, 50, 100]" :page-size="state.limit" :total="state.total" layout="total, sizes, prev, pager, next, jumper" @size-change="state.pageSizeChangeHandle" @current-change="state.pageCurrentChangeHandle"> </el-pagination>
  </div>
</template>

<script lang="ts" setup>
import useView from "@/hooks/useView";
import { reactive, toRefs } from "vue";
import dayjs from "dayjs";

const view = reactive({
  getDataListURL: "/swfTask/swftask/page",
  getDataListIsPage: true,
  exportURL: "/swfTask/swftask/export",
  deleteURL: "/swfTask/swftask",
  deleteIsBatch: true,
  dataForm: {}
});

const state = reactive({ ...useView(view), ...toRefs(view) });
</script>
